import React, { Component } from 'react';
import {
    View,
    ScrollView,
    Text,
    Image,
    WebView,
    StyleSheet
} from 'react-native'
import Style from '../../utils/style/style';
import * as utils from '../../utils/utils';
import o from '../../components/o'
import { connect } from 'react-redux';
class BannerDetail extends Component {
    constructor(props) {
        super(props);
        this.state = {
            title: '',
            content: '',
        }
    }
    static navigationOptions = {
        title: "公告"
    }
    componentDidMount() {
        const { navigation } = this.props;
        let RecId = navigation.getParam('item');
        console.log(RecId)
        this._getDetail(RecId)
    }

    _getDetail(RecId) {
        const { token } = this.props;
        let params = {
            select: 'RecId,topicName,topicContent',
            filter: `RecId eq '${RecId}'`,
            api: `TopicReleases?token=${token}`
        }
        o(params.api).filter(params.filter).select(params.select).get().then(
            oHandler => {
                let res = oHandler.data
                let { topicName, topicContent } = res[0]
                topicContent = utils.handleHtml(topicContent)
                this.setState({
                    content: topicContent,
                    title: topicName
                })
            }
        ).catch(
            e => {
                console.log(e)
            }
        )
    }

    render() {
        let { title, content } = this.state
        if (content && title) {
            content = '<p style="text-align:center;font-size:20px">' + title + '</p>' + content
        }
        return (
            title && content ?
                <WebView
                    scalesPageToFit={true}
                    source={{ html: content, baseUrl: '' }}
                    style={style.webview}></WebView>
                : <View />
        )
    }
}

const style = StyleSheet.create({
    title: {
        height: 50,
        width: Style.width,
        fontSize: 20
    },
    webview: {
        width: Style.width
    }
})

export default connect(
    state => ({ token: state.User.token })
)(BannerDetail)